<template>
  <div class="parent">
    <h3>父组件</h3>
		<h4>我的数据：{{a}}、{{b}}、{{c}}、{{d}}</h4>

		<!-- <button @click="test1" @mouseenter="test2">按钮</button> -->
		<!-- <button v-on="{click:test1,mouseenter:test2}">按钮</button> -->

		<!-- 给子一个一个的传递 -->
		<Child :a="a" :b="b" :c="c" :d="d" @gengxin-a="saveA" @gengxin-b="saveB"/>

		<!-- 给子批量的传递 -->
		<!-- <Child v-bind="{a,b,c,d}" /> -->


  </div>
</template>

<script>
	import Child from './Child'

  export default {
    name: 'Index',
		components:{Child},
		data() {
			return {
				a:1,
				b:2,
				c:3,
				d:4
			}
		},
		methods: {
			saveA(value){
				this.a = value
			},
			saveB(value){
				this.b = value
			},
			test1(){
				console.log(1)
			},
			test2(){
				console.log(2)
			}
		},
  }
</script>

<style lang="less" scoped>
	.parent{
		background-color: rgb(165, 164, 164);
		padding: 20px;
		border-radius: 10px;
	}
</style>
